import React, { Component } from "react";

export default class SearchBar extends Component {
  constructor(props) {
    super(props);
    this.state = {
      key: "", //搜索的关键字
      flag: false, //是否库存
    };
  }
  setFlag = (flag) => {
    this.setState({
      flag,
    });
    this.props.search(flag,this.state.key);
  };
  setKey = (key)=>{
    this.setState({
      key
    })
    this.props.search(this.state.flag,key);

  }

  render() {
    return (
      <div>
        <input  value={this.state.key} onChange={(e)=>{
            this.setKey(e.target.value);
        }}/>
        <br />
        <input
          type="checkbox"
          checked={this.state.flag}
          onChange={(e) => {
            this.setFlag(e.target.checked);
          }}
        />{" "}
        只显示有货的
      </div>
    );
  }
}
